<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>修改密码</title>
    <meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <link rel="stylesheet" href="/static/css/css.css"/>
    <link rel="stylesheet" href="https://cdn.bootcss.com/weui/1.1.2/style/weui.min.css">
    <link rel="stylesheet" href="http://at.alicdn.com/t/font_604068_1q52vvyt0kd9rudi.css">
    <script src="https://cdn.bootcss.com/jquery/1.11.0/jquery.min.js"></script>
    <script src="https://cdn.bootcss.com/jquery-weui/1.2.0/js/jquery-weui.min.js"></script>
    <script src="/static/js/vue.js"></script>

</head>
<body>

<header class="head headTitle">
    <a class="back" onclick="window.location.href='/home/logintest/shezhi'"><img src="/static/images/back_gray.png"></a>
    <h1 class="title">修改密码</h1>
</header>
<div id="app">

    <form   method="post"   id="loginForm" >
    <div class="weui-cells__title" style="margin-top: 50px">新密码</div>
    <div class="weui-cells">
        <div class="weui-cell">
            <div class="weui-cell__bd">
                <input class="weui-input"  name="mima" id="mm" type="password" placeholder="请输入新密码">
            </div>
        </div>
    </div>
    <div class="weui-cells__title">当前绑定手机号码</div>
    <div class="weui-cells">
        <div class="weui-cell">
            <div class="weui-cell__bd">
                {$us.phone}
            </div>
        </div>
    </div>
    <div class="weui-cells__title">短信验证码</div>
    <div class="weui-cell weui-cell_vcode" style="background: white;">
        <div class="weui-cell__bd">
            <input class="weui-input"    id="code" minlength="6" maxlength="6"
                   required="" autocomplete="off"  type="text" placeholder="请输入短信验证码">
        </div>
        <div class="weui-cell__ft">
            <input class=" weui-vcode-btn  btnGray loginObtain sendSMS"
                   style="border: none;border-radius: 5px;background: white;border: 1px  solid  #fe8200;color: #fe8200"
                   type="button" v-if="!sending" onclick="get_code()"
                   value="获取验证码">
            <input class=" weui-vcode-btn  btnGray loginObtain sendSMS"
                   style="border: none;border-radius: 5px;background: white;border: 1px  solid  #fe8200;color: #fe8200"
                   type="button" v-if="sending" disabled="disabled"
                   :value="sec+' 秒'">
        </div>

    </div>

    <div style="margin-top: 25px;text-align: center">
        <input class="xgmima"   value=" 确定" type="submit" style="border:  none;  height: 45px;line-height: 45px; width: 90%;border: 1px solid  #fe8200;background: #fe8200;color: #ffffff;border-radius: 5px;font-size: 20px">

        </input>
    </div>
    </form>
</div>



</body>

<script>


    var app = new Vue({
        el: '#app',
        data: {
            sending: false,
            sec: 30
        }
    });

    $('.xgmima').click(function () {
        var code=$('#code').val();
        var mima = $('#mm').val();
        if (code && mima) {
            $.post('xg',$('#loginForm').serialize(),{mima:mima,code:code},function (res) {
                if (res.code == 1) {
                    $.toast(res.msg);
                    location.href = '/home/my/my'
                } else {
                    $.toast(res.msg, '修改密码失败');
                }
            });
        }

    });

    function get_code() {
        app.sending = true;
        var tm = setInterval(function () {
            app.sec--;
            if (app.sec == 0) {
                clearInterval(tm);
                app.sending = false;
                app.sec = 30;
            }
        }, 1000);

        $.get('/home/My/sms', function (res) {
            if (res.code == 1) {
                $.toast(res.msg);
            } else {
                $.toast(res.msg, 'cancel');
            }

        });

    }

</script>

</html>